<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('菜单列表')" />
</head>
<body class="gray-bg">
<section class="content">
    <div class="jax-box-table">
        <div id="toolbar" style="margin-bottom: 15px;">
            <button id="btn_add" type="button" class="btn btn-primary btn-sm" shiro:hasPermission="menu:add">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
            </button>
            <button id="expandAllBtn" type="button" class="btn btn-success btn-sm">
                <i class="fa fa-exchange" aria-hidden="true"></i>展开/折叠
            </button>
        </div>
        <table id="menuTable" data-mobile-responsive="true" data-click-to-select="true"></table>
    </div>
</section>
<th:block th:include="include :: footer" />
<script>
    var editFlag = "[[${@permission.hasPerm('menu:edit')}]]";
    var deleteFlag = "[[${@permission.hasPerm('menu:delete')}]]";
    var Menu = {
        id: "menuTable",
        table: null,
        layerIndex: -1
    };
    /**
     * 初始化表格的列
     */
    Menu.initColumn = function () {
        var columns = [
            {
                title: '菜单名称',
                field: 'name',
                align: 'left',
                formatter: function(row, index) {
	                if ($.common.isEmpty(row.icon)) {
	                    return row.name;
	                } else {
	                    return ' <i class="'+row.icon+'"></i> <span class="nav-label">' + row.name + '</span>';
	                }
	            }
            },
            {
                title: '菜单排序',
                field: 'orderNum',
                align: 'center',
            },
            {
                title: '菜单类型',
                field: 'type',
                align: 'center',
                formatter:function(row,index){
                    switch (row.type){
                        case 0 : return '<span class="label label-primary">目录</span>';
                        case 1 : return '<span class="label label-success">菜单</span>';
                        case 2 : return '<span class="label label-warning">按钮</span>';
                    }
                }
            },
            {	
            	title: '菜单路径',
                field: 'url',
                align: 'left',
            },
            {
            	title: '权限标识',
                field: 'perms',
                align: 'center',
                formatter: function(row, index) {
	                if ($.common.isEmpty(row.perms)) {
	                    return '--';
	                } else {
	                    return row.perms;
	                }
	            }
            },
            {
                title: '菜单描述',
                field: 'description',
                align: 'left',
            },
            {
                field : 'operation',
                title : '操作',
                align : "center",
                formatter : function(row, index) {
                	var actions = [];
                	if (editFlag == "true") {
                		actions.push('<a class="btn btn-success btn-xs cursor-pointer" href="javascript:;" onclick="editMenu('+row.menuId+')"><i class="fa fa-edit"></i>编辑</a> ');
                	}
                	if (deleteFlag == "true") {
                		actions.push('<a class="btn btn-danger btn-xs cursor-pointer" href="javascript:;" onclick="deleteMenu('+row.menuId+')"><i class="fa fa-remove"></i>删除</a> ');
                	}
                    return actions.join('');
                }
            }]
        return columns;
    };
    /*加载权限列表*/
    var colunms = Menu.initColumn();
    var table = new TreeTable(Menu.id, "/menu/list", colunms, "menuId");
    table.setExpandColumn(0); // 设置展开关闭列
    table.setIdField("menuId"); // 设置选中列id值
    table.setCodeField("menuId");
    table.setParentCodeField("parentId");
    table.setExpandAll(true); // 设置折叠展开
    table.setStriped(false); // 设置表格条纹
    table.init(); //初始化表格
    Menu.table = table;
    // 折叠展开树形表格数据
    var expandFlag;
    $("#expandAllBtn").click(function() {
        var dataExpand = $.common.isEmpty(table.expandAll) ? true : table.expandAll;
        expandFlag = $.common.isEmpty(expandFlag) ? dataExpand : expandFlag;
        if (!expandFlag) {
        	Menu.table.setExpandAll(true);
        	table.init();
        } else {
        	Menu.table.setExpandAll(false);
        	table.init();
        }
        expandFlag = expandFlag ? false: true;
    })
    /*编辑权限*/
    function editMenu(menuId) {
    	$.modal.dialog_openFull("编辑菜单", "/menu/edit?menuId="+menuId);
    }
    /*删除权限*/
    function deleteMenu(menuId) {
        $.modal.confirm("确认删除该权限？",function () {
        	$.common.postAjax('/menu/delete',{"menuId":menuId},function (data) {
                if(data.code == 0){
                    Menu.table.refresh();
                    toastr.success(data.msg);
                } else {
                    toastr.error(data.msg);
                }
            });
        })
    }
    /*添加权限*/
    $("#btn_add").on("click",function () {
        var selections = $('#menuTable').bootstrapTreeTable('getSelections',{id:"menuId"});
    	var menuId = 0;
        if(selections.length==0){
        	menuId = 0;
        }else{
        	menuId = selections[0].menuId;
        }
        $.modal.dialog_openFull("新增菜单", "/menu/add?menuId=" + menuId);
    })
</script>
</body>
</html>